import { ModalForm, ProFormInstance } from '@ant-design/pro-components';
import {
  ProForm,
  ProFormDigit,
  ProFormSelect,
  ProFormText,
  ProFormDatePicker,
  ProFormDateRangePicker,
} from '@ant-design/pro-components';
import ProLayout, {
  PageContainer,
  SettingDrawer,
  FooterToolbar,
} from '@ant-design/pro-layout';
import moment from 'moment';
import { history, useRequest } from 'umi';
import { PlusOutlined, InboxOutlined } from '@ant-design/icons';
import { FileSearchOutlined } from '@ant-design/icons';
import { message, Button, Breadcrumb, Space, Collapse, Modal } from 'antd';
import { useEffect, useRef, useState } from 'react';
const { Panel } = Collapse;

import { ProCard, ProTable, ProDescriptions } from '@ant-design/pro-components';
import { UploadProps, Upload } from 'antd';
import { UploadOutlined } from '@ant-design/icons';
import TbaleExplainMap from '@/components/TipsMap';
import { TitleAdapter } from '../../commons/Adapter';
const { Item } = ProDescriptions;
const { Dragger } = Upload;
export default () => {
  const [updateStatus, setUpdateStatus] = useState(false);
  const [dataSource, setDataSource] = useState<any>([]);
  const [gutter, setGutter] = useState(12);
  const [filedDisable, setFiledDisable] = useState({
    userid: true,
    userJobLevel: true,
    userJobTitle: true,
    userType: true,
  });

  const [userListTabelFlag, setUserListTabelFlag] = useState<any>(false); //人员列表弹窗显示与否
  const [userListTabelData, setUserListTabelData] = useState<any>([]); //人员列表表格数据

  const [newpath, setNewPath] = useState();

  const [selectedUserListTabelData, setSelectedUserListTabelData] =
    useState<any>([]); //选中的人员列表数据，用于提交
  const [selectedRowKeys, setSelectedRowKeys] = useState<any>([]); //默认全选
  const [formDataForSubmit, setFormDataForSubmit] = useState<any>(); //表单数据，用于提交

  const [yearFundDataTemp, setYearFoundDataTemp] = useState<any>([]); //年度金额表格缓存数据
  const [yearFundData, setYearFoundData] = useState<any>([]); //年度金额表格数据，用于提交
  const [yearVisible, setYearVisible] = useState(false); //

  const [saveType, setSaveType] = useState(''); //modal 点击确认 调用新增、更新还是暂存接口
  const [allLabel, setAllLabel] = useState([]);

  const [show, setShow] = useState(false);

  const [formData, setFormData] = useState<any>();
  const formRef = useRef<ProFormInstance>();
  const editYearFormRef = useRef<ProFormInstance>();

  const props: UploadProps = {
    name: 'file',
    action: 'http://10.1.40.84:9993/common/uploadFile',
    headers: {
      Authorization: localStorage.getItem('token') || '',
    },
    maxCount: 1,
    accept: '.docx,.doc,.pdf,.xls',
    onChange(info) {
      if (info.file.status !== 'uploading') {
        console.log(info.file, info.fileList);
      }
      if (info.file.status === 'done') {
        console.log(info?.file?.response?.code == 401);
        console.log(info);

        if (info?.file?.response?.code == 200) {
          formRef.current?.setFieldsValue({
            annexPath: info?.file?.response.data,
          });
          message.success(`${info.file.name} 上传成功！`);
        } else if (info?.file?.response?.code == 401) {
          message.error('用户登录过期请重新登陆！');
        } else {
          message.error(`${info.file.name} 上传失败`);
        }
      } else if (info.file.status === 'error') {
        message.error(`${info.file.name} 上传失败！`);
      }
    },
  };
  const [pageType, setPageType] = useState(
    history.location.pathname.replace(
      '/LabAchievements/ScientificResearch/InterCoopProject/EditInterCoopProject/',
      '',
    ),
  );
  //新建国际项目
  const insertNewInterProj = useRequest(
    (data = null) => {
      return {
        url: `http://10.1.40.84:9998/project/insertNewInterProj`,
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      onSuccess: (result, params) => {
        console.log(result);
        if (result.code === 200) {
          history.push('/LabAchievements/ScientificResearch/InterCoopProject');
        } else {
          message.error(result.msg);
        }
      },
      manual: true,
      formatResult: (res) => res,
    },
  );

  //更改年度小表
  const updateYearFund = useRequest(
    (data = null) => {
      return {
        url: `http://10.1.40.84:9998/project/updateYearFund`,
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      onSuccess: (result, params) => {
        console.log(result);
        if (result.code === 200) {
          message.success(result.msg);
          getOneInterProjDetail.run(pageType); //重新拉取信息
          setYearVisible(false); //关闭弹窗
        } else {
          message.error(result.msg);
        }
      },
      manual: true,
      formatResult: (res) => res,
    },
  );

  //项目详细信息
  const getOneInterProjDetail = useRequest(
    (data = null) => {
      return {
        url: `http://10.1.40.84:9998/project/getOneInterProjDetail?id=${data}`,
        method: 'GET',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
      };
    },
    {
      manual: true,
      onSuccess: (result, params) => {
        var temp = JSON.parse(JSON.stringify(result.yearList));
        temp.map((e: any) => {
          e.tableKey =
            e.year + '' + (e.yearFund + '') + Math.trunc(Math.random() * 100);
        });
        temp.sort((a: any, b: any) => {
          return parseInt(b.year || '0') - parseInt(a.year || '0');
        });
        setFormData(result);
        formRef.current?.setFieldsValue(result);
        setYearFoundDataTemp(temp);
        setYearFoundData(temp);
      },
    },
  );

  //暂存国际项目
  const insertTempInterProj = useRequest(
    (data = null) => {
      return {
        url: `http://10.1.40.84:9998/project/insertTempInterProj`,
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      onSuccess: (result, params) => {
        message.info(result.msg);
        history.push('/LabAchievements/ScientificResearch/InterCoopProject');
      },
      manual: true,
      formatResult: (res) => res,
    },
  );

  //模糊查询下拉框-职称
  const getLike = useRequest(
    (data = { field: 'technicalName', level: '正高级' }) => {
      return {
        url: `http://10.1.40.84:9993/getLike`,
        method: 'Post',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {},
  );

  //模糊查询下拉框国家
  const getLikeCountry = useRequest(
    (data = { field: 'country' }) => {
      return {
        url: `http://10.1.40.84:9993/getLike`,
        method: 'Post',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      manual: true,
    },
  );

  //获取全部项目标签，用于下拉框
  const getAllLabel = useRequest(
    (data = null) => {
      return {
        url: 'http://10.1.40.84:9993/getAllLabel',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      onSuccess: (result, param) => {
        setAllLabel(result);
      },
    },
  );

  //添加标签
  const addLabelDetail = useRequest(
    (data = {}) => {
      return {
        url: 'http://10.1.40.84:9993/addLabelDetail',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      onSuccess: (result, params) => {
        console.log(result);
        getAllLabel.run();
        message.success('添加成功');
      },
      onError: (e, params) => {
        console.log(e);
        console.log(params);
      },
      // formatResult: res => res
      manual: true,
    },
  );
  //修改国际项目
  const updateInterProj = useRequest(
    (data = null) => {
      return {
        url: `http://10.1.40.84:9998/project/updateInterProj`,
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data: data,
      };
    },
    {
      onSuccess: (result, params) => {
        console.log(result);
        if (result.code === 200) {
          history.push('/LabAchievements/ScientificResearch/InterCoopProject');
          message.success(result.msg);
        } else {
          message.error(result.msg);
        }
      },
      manual: true,
      formatResult: (res) => res,
    },
  );

  //审核
  const updateStatusIpi = useRequest(
    (data = {}) => {
      return {
        url: 'http://10.1.40.84:9993/common/updateStatus',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      manual: true,
    },
  );

  //根据人员字符串返回人员详情
  const getUserList = useRequest(
    (data = {}) => {
      return {
        url: 'http://10.1.40.84:9993/user/getUserList',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      onSuccess: (result, params) => {
        if (result) {
          setUserListTabelData(result);
          setSelectedUserListTabelData(result);
          setUserListTabelFlag(true);
          var temp: any = [];
          result.map((e: any) => {
            temp.push(e.webId);
          });
          setSelectedRowKeys(temp);
        }
      },
      manual: true,
    },
  );

  //人员列表表头
  const columns: any = [
    {
      title: '工号',
      key: 'username',
      dataIndex: 'username',
    },
    {
      title: '姓名',
      key: 'realName',
      dataIndex: 'realName',
    },
    {
      title: '类别',
      key: 'userType',
      dataIndex: 'userType',
    },
  ];

  //表单年度金额表头
  const columnsYearFoundForm: any = [
    {
      title: '年度',
      key: 'year',
      dataIndex: 'year',
      align: 'center',
    },
    {
      title: '到校款金额(万元)',
      key: 'yearFund',
      dataIndex: 'yearFund',
      align: 'center',
    },
    {
      title: '操作',
      key: 'edit',
      align: 'center',
      // hideInTable: localStorage.getItem('isEdit') === '查看',
      width: 150,
      render: (_: any, record: any) => {
        return (
          <Space>
            <ModalForm
              title={'编辑年度到校金额'}
              formRef={editYearFormRef}
              trigger={<Button type="link">编辑</Button>}
              onFinish={async (values) => {
                var temp = yearFundData.filter((e: any) => {
                  return e.tableKey != record.tableKey;
                });
                temp.push({
                  ...values,
                  tableKey:
                    values.year +
                    '' +
                    (values.yearFund + '') +
                    Math.trunc(Math.random() * 100),
                });
                temp.sort((a: any, b: any) => {
                  return parseInt(b.year || '0') - parseInt(a.year || '0');
                });
                setYearFoundData(temp);
                return true;
              }}
              request={() => {
                return record;
              }}
              modalProps={{
                destroyOnClose: true,
              }}
              grid
              width={'20%'}
            >
              <ProFormDatePicker.Year
                name={'year'}
                label={'年度'}
                rules={[{ required: true, message: '请输入' }]}
                disabled
              />
              <ProFormDigit
                name={'yearFund'}
                label={'到校款金额(万元)'}
                rules={[{ required: true, message: '请输入' }]}
              />
            </ModalForm>
            {/* <Button
              type="link"
              onClick={() => {
                var temp = yearFundData.filter((e: any) => {
                  return e.tableKey != record.tableKey;
                });
                setYearFoundData(temp);
              }}
            >
              删除
            </Button> */}
          </Space>
        );
      },
    },
  ];

  //列表年度金额表头
  const columnsYearFoundList: any = [
    {
      title: '年度',
      key: 'year',
      dataIndex: 'year',
      align: 'center',
    },
    {
      title: '到校款金额(万元)',
      key: 'yearFund',
      dataIndex: 'yearFund',
      align: 'center',
    },
    {
      title: '操作',
      key: 'edit',
      align: 'center',
      // hideInTable: localStorage.getItem('isEdit') === '查看',
      width: 150,
      render: (_: any, record: any) => {
        return (
          <Space>
            <ModalForm
              title={'编辑年度到校金额'}
              formRef={editYearFormRef}
              trigger={<Button type="link">编辑</Button>}
              onFinish={async (values) => {
                var temp = yearFundData.filter((e: any) => {
                  return e.tableKey != record.tableKey;
                });
                temp.push({
                  ...values,
                  tableKey:
                    values.year +
                    '' +
                    (values.yearFund + '') +
                    Math.trunc(Math.random() * 100),
                });
                temp.sort((a: any, b: any) => {
                  return parseInt(b.year || '0') - parseInt(a.year || '0');
                });
                setYearFoundData(temp);
                return true;
              }}
              request={() => {
                return record;
              }}
              modalProps={{
                destroyOnClose: true,
              }}
              grid
              width={'20%'}
            >
              <ProFormDatePicker.Year
                name={'year'}
                label={'年度'}
                rules={[{ required: true, message: '请输入' }]}
                disabled
              />
              <ProFormDigit
                name={'yearFund'}
                label={'到校款金额(万元)'}
                rules={[{ required: true, message: '请输入' }]}
              />
            </ModalForm>
            {/* <Button
              type="link"
              onClick={() => {
                var temp = yearFundData.filter((e: any) => {
                  return e.tableKey != record.tableKey;
                });
                setYearFoundData(temp);
              }}
            >
              删除
            </Button> */}
          </Space>
        );
      },
    },
  ];

  //根据时间区间生成年度小表
  const createYearFoundTable = () => {
    const timeString2Int = (timeString: any) => {
      return parseInt(moment(timeString).format('YYYY'));
    };
    var tableDataTemp = JSON.parse(JSON.stringify(yearFundData));
    var startTime = timeString2Int(
      formRef.current?.getFieldValue('timeList')[0],
    );
    var endTime = timeString2Int(formRef.current?.getFieldValue('timeList')[1]);
    var temp: any;
    var tempList: any = [];
    for (var i = endTime; i >= startTime; i--) {
      temp = {
        year: i + '',
        yearFund: 0,
        tableKey: i + '0' + Math.trunc(Math.random() * 100),
      };
      tableDataTemp.map((e: any) => {
        if (e.year === i + '') {
          temp = e;
        }
      });
      tempList.push(temp);
    }
    setYearFoundData(tempList);
  };

  //新建项目提交
  const insertSubmit = () => {
    var userListTemp: any = [];
    selectedUserListTabelData.map((e: any) => {
      var temp = {
        userid: e.username,
        username: e.realName,
        userrank: e.userrank,
        usertype: e.usertype,
        userindentify: e.userindentify,
        userjobtitle: e.technicalName,
        userjoblevel: e.technicalGrade,
      };
      userListTemp.push(temp);
    });
    insertNewInterProj.run({
      ...formDataForSubmit,
      timeList: [
        moment(formDataForSubmit.timeList[0]).format('YYYY-MM-DD'),
        moment(formDataForSubmit.timeList[1]).format('YYYY-MM-DD'),
      ],
      userList: userListTemp,
      projectYearList: yearFundData,
    });
  };

  //更新项目提交
  const updateSubmit = () => {
    var userListTemp: any = [];
    selectedUserListTabelData.map((e: any) => {
      var temp = {
        userid: e.username,
        username: e.realName,
        userrank: e.userrank,
        usertype: e.usertype,
        userindentify: e.userindentify,
        userjobtitle: e.technicalName,
        userjoblevel: e.technicalGrade,
      };
      userListTemp.push(temp);
    });
    updateInterProj.run({
      ...formDataForSubmit,
      timeList: [
        moment(formDataForSubmit.timeList[0]).format('YYYY-MM-DD'),
        moment(formDataForSubmit.timeList[1]).format('YYYY-MM-DD'),
      ],
      userList: userListTemp,
      projectYearList: yearFundData,
    });
  };

  //暂存项目提交
  const tempSubmit = () => {
    var temp = formRef.current?.getFieldsValue(true);
    temp = { ...temp, projectYearList: yearFundData };
    console.log(temp.timeList);
    if (temp.timeList && temp.timeList[0] && temp.timeList[1]) {
      temp.timeList = [
        moment(temp.timeList[0]).format('YYYY-MM-DD'),
        moment(temp.timeList[1]).format('YYYY-MM-DD'),
      ];
    }
    if (selectedUserListTabelData?.length) {
      var userListTemp: any = [];
      selectedUserListTabelData.map((e: any) => {
        var temp = {
          userid: e.username,
          username: e.realName,
          userrank: e.userrank,
          usertype: e.usertype,
          userindentify: e.userindentify,
          userjobtitle: e.technicalName,
          userjoblevel: e.technicalGrade,
        };
        userListTemp.push(temp);
      });
      temp.userList = userListTemp;
    }

    console.log(temp);
    insertTempInterProj.run(temp);
  };

  useEffect(() => {
    if (pageType != 'new') {
      getOneInterProjDetail.run(pageType);
    }
  }, []);

  return (
    <PageContainer
      header={{
        title: getOneInterProjDetail?.data?.message ? (
          <div style={{ fontSize: 14, textAlign: 'center', color: 'red' }}>
            拒绝原因：{getOneInterProjDetail?.data?.message}
          </div>
        ) : null,
        // (
        //   <>{pageType === 'new' ? '新建国际合作项目' : '编辑国际合作项目'}</>
        // ),
        breadcrumb: (
          <Breadcrumb>
            <Breadcrumb.Item>科学研究</Breadcrumb.Item>
            <Breadcrumb.Item>国际合作项目</Breadcrumb.Item>
            <Breadcrumb.Item>
              {TitleAdapter(
                pageType,
                localStorage.getItem('isEdit'),
                '国际合作项目',
              )}
            </Breadcrumb.Item>
          </Breadcrumb>
        ),
      }}
      extra={
        <div>
          {localStorage.getItem('isEdit') === '审核' ? (
            <Space>
              <ModalForm
                title="拒绝"
                trigger={<Button key="2">返回成员修改</Button>}
                autoFocusFirstInput
                modalProps={{
                  onCancel: () => console.log('run'),
                  destroyOnClose: true,
                }}
                submitTimeout={2000}
                onFinish={async (values) => {
                  console.log(values);
                  updateStatusIpi
                    .run({
                      tableName: 'INTER_CPT_PROJECT',
                      ids: [pageType],
                      status: 3, //拒绝
                      message: values.message,
                      tab: '子方向视角',
                    })
                    .then(() => {
                      getOneInterProjDetail.run(pageType).then((e) => {
                        formRef.current?.setFieldsValue(e);
                        setNewPath(e?.annexPath);
                      });
                      history.goBack();
                      message.success('操作成功');
                    });
                  return true;
                }}
                grid={true}
                initialValues={{
                  message: getOneInterProjDetail?.data?.message,
                }}
              >
                <ProForm.Group>
                  <ProFormText
                    name="message"
                    label="拒绝原因"
                    placeholder="请输入拒绝原因"
                    colProps={{ span: 24 }}
                    rules={[{ required: true, message: '请输入拒绝原因' }]}
                  />
                </ProForm.Group>
              </ModalForm>
              <Button
                key="1"
                type="primary"
                onClick={() => {
                  updateStatusIpi
                    .run({
                      tableName: 'INTER_CPT_PROJECT',
                      ids: [pageType],
                      status: 2, //审核通过
                      tab: '子方向视角',
                    })
                    .then(() => {
                      getOneInterProjDetail.run(pageType).then((e) => {
                        formRef.current?.setFieldsValue(e);
                        setNewPath(e?.annexPath);
                      });
                      history.goBack();
                      message.success('操作成功');
                    });
                }}
              >
                提交管理员审核
              </Button>
            </Space>
          ) : null}
        </div>
      }
      content={
        <>
          {localStorage.getItem('isEdit') === '查看' ? (
            formData ? (
              <ProDescriptions
                column={4}
                request={async () => {
                  return Promise.resolve({
                    success: true,
                    data: formData,
                  });
                }}
                bordered
                labelStyle={{ width: 170 }}
              >
                <Item
                  label={'序号'}
                  dataIndex={'seq'}
                  hideInDescriptions={
                    localStorage.getItem('identity') !== '管理员'
                  }
                  span={4}
                />
                <Item label={'负责人'} dataIndex={'director'} span={4} />
                <Item label={'项目名称'} dataIndex={'projectName'} span={2} />
                <Item label={'项目来源'} dataIndex={'projectSource'} span={2} />
                <Item
                  label={'合作国家/地区'}
                  dataIndex={'cptArea'}
                  request={async () => {
                    var labelValues: any = [];
                    await getLikeCountry
                      .run({ field: 'country' })
                      .then((data) => {
                        labelValues = data;
                      });
                    return labelValues;
                  }}
                  span={2}
                />
                <Item label={'合作单位'} dataIndex={'cptCompany'} span={2} />
                <Item
                  label={'实验室人员'}
                  dataIndex={'labUser'}
                  span={2}
                  hideInDescriptions={
                    localStorage.getItem('identity') !== '管理员'
                  }
                />
                <Item
                  label={'学生及非本室人员'}
                  dataIndex={'stuAndOutUser'}
                  span={2}
                  hideInDescriptions={
                    localStorage.getItem('identity') !== '管理员'
                  }
                />

                <Item
                  label={'项目开始时间'}
                  dataIndex={'startTime'}
                  valueType={'date'}
                  span={2}
                />
                <Item
                  label={'项目结束时间'}
                  dataIndex={'endTime'}
                  valueType={'date'}
                  span={2}
                />
                <Item
                  label={'项目状态'}
                  dataIndex={'projectState'}
                  hideInDescriptions={
                    localStorage.getItem('identity') !== '管理员'
                  }
                  span={2}
                />
                {/* <Item label={'佐证材料状态'} dataIndex={'annexState'} /> */}
                <Item label={'佐证材料'} span={2}>
                  {formData.annexPath ? (
                    <Button
                      type="link"
                      onClick={() => {
                        window.open(formData.annexPath);
                      }}
                    >
                      {' '}
                      查看材料
                    </Button>
                  ) : (
                    '暂无材料'
                  )}
                </Item>
                <Item label={'项目总经费(万元)'} span={2}>
                  {
                    <>
                      {formData.totalFund}
                      <Button
                        type="link"
                        onClick={() => {
                          setYearFoundData(yearFundDataTemp);
                          setYearVisible(true);
                        }}
                      >
                        查看详情
                      </Button>
                    </>
                  }
                </Item>
                <Item
                  label={'项目标签'}
                  dataIndex={'labelList'}
                  span={2}
                  request={async () => {
                    var temp: any;
                    await getAllLabel.run().then((data) => {
                      temp = data;
                    });
                    return temp;
                  }}
                  hideInDescriptions={
                    localStorage.getItem('identity') !== '管理员'
                  }
                />
              </ProDescriptions>
            ) : (
              ''
            )
          ) : (
            <ProForm
              grid
              // layout="horizontal"
              onFinish={async (values) => {
                console.log(values);
                if (!values?.annexPath) {
                  message.warning('请上传材料！');
                } else {
                  if (pageType == 'new') {
                    setSaveType('新增');
                  } else {
                    setSaveType('更新');
                  }
                  setFormDataForSubmit(values);
                  getUserList.run({ userList: values.director });
                }
              }}
              formRef={formRef}
              autoFocusFirstInput
              submitter={{
                render: (props, dom) => (
                  <FooterToolbar>
                    {localStorage.getItem('isEdit') === '审核' ? null : (
                      <>
                        {pageType === 'new' ||
                        getOneInterProjDetail?.data?.isPass + '' === '-1' ? (
                          <Button
                            onClick={() => {
                              setSaveType('暂存');
                              let values = props.form?.getFieldsValue();
                              if (values.director) {
                                getUserList
                                  .run({ userList: values.director })
                                  .catch((e) => message.error('作者填写有误'));
                              } else {
                                tempSubmit();
                              }
                            }}
                          >
                            暂存
                          </Button>
                        ) : null}
                        <Button type="primary" htmlType="submit">
                          提交
                        </Button>
                      </>
                    )}
                  </FooterToolbar>
                ),
              }}
            >
              <ProFormDigit name={'id'} label={'编号'} hidden />
              <ProFormText
                name={'annexState'}
                label={'佐证材料状态'}
                required
                colProps={{ span: 8 }}
                hidden
              />
              <ProFormText
                name={'annexPath'}
                label={'佐证材料地址'}
                required
                colProps={{ span: 16 }}
                hidden
              />
              <ProFormText
                name={'isPass'}
                label={'审核状态'}
                colProps={{ span: 8 }}
                placeholder={''}
                disabled
                hidden
              />

              <ProForm.Group rowProps={{ gutter: gutter }} title={'基本信息'}>
                <ProFormDigit
                  name={'seq'}
                  label={'序号'}
                  disabled
                  hidden={true}
                  colProps={{ span: 6 }}
                />
                <ProFormText
                  name={'projectName'}
                  label={'项目名称'}
                  colProps={{
                    span: 5,
                  }}
                  rules={[{ required: true, message: '请输入' }]}
                />
                <ProFormText
                  name={'director'}
                  label={'负责人'}
                  colProps={{ span: 5 }}
                  rules={[{ required: true, message: '请输入' }]}
                />
              </ProForm.Group>
              <ProForm.Group rowProps={{ gutter: gutter }} title={'详细内容'}>
                {/* <ProFormDatePicker.Year
                  name={'year'}
                  label={'年度'}
                  colProps={{ span: 4 }}
                  hidden={localStorage.getItem('identity') !== '管理员'}
                /> */}
                <ProFormText
                  name="cptArea"
                  label="合作国家/地区/国际组织"
                  rules={[{ required: true, message: '请输入' }]}
                  colProps={{
                    span: 5,
                  }}
                />
                <ProFormText
                  name={'cptCompany'}
                  label={'合作单位(没有合作单位则填"无")'}
                  colProps={{ span: 5 }}
                  rules={[{ required: true, message: '请输入' }]}
                />
                <ProFormText
                  name={'projectState'}
                  label={'项目状态'}
                  colProps={{ span: 5 }}
                  placeholder={''}
                  disabled
                  hidden={true}
                />
                <ProFormText
                  name={'projectSource'}
                  label={'项目来源(项目批准单位)'}
                  colProps={{ span: 5 }}
                  rules={[{ required: true, message: '请输入' }]}
                />
              </ProForm.Group>
              <ProForm.Group rowProps={{ gutter: gutter }}>
                <ProFormText
                  name={'labUser'}
                  label={'实验室人员'}
                  colProps={{ span: 5 }}
                  // rules={[{ required: true, message: '请输入' }]}
                  hidden={localStorage.getItem('identity') !== '管理员'}
                />
                <ProFormText
                  name={'stuAndOutUser'}
                  label={'学生及非本室人员'}
                  colProps={{ span: 5 }}
                  hidden={localStorage.getItem('identity') !== '管理员'}
                />
              </ProForm.Group>
              <ProForm.Group rowProps={{ gutter: gutter }} title={'经费及时限'}>
                <ProFormDigit
                  name={'totalFund'}
                  label={'项目总经费(万元)'}
                  colProps={{ span: 5 }}
                  rules={[{ required: true, message: '请输入' }]}
                />
                <ProFormDateRangePicker
                  name={'timeList'}
                  label={'项目起止时间'}
                  fieldProps={{
                    picker: 'month',
                    format: 'YYYY-MM',
                    onOpenChange: (open) => {
                      if (
                        !open &&
                        formRef?.current?.getFieldValue('timeList')
                      ) {
                        createYearFoundTable();
                      }
                    },
                  }}
                  colProps={{ span: 8 }}
                  rules={[{ required: true, message: '请输入' }]}
                />
              </ProForm.Group>
              <ProForm.Group
                rowProps={{ gutter: gutter }}
                colProps={{ span: 12 }}
              >
                <ProCard
                  bordered
                  title={'年度到校金额'}
                  // extra={
                  //   <ModalForm
                  //     trigger={<Button type={'link'}>新增到校款</Button>}
                  //     title={'新增到校款'}
                  //     onFinish={async (values) => {
                  //       var temp = JSON.parse(JSON.stringify(yearFundData));
                  //       temp.push({
                  //         ...values,
                  //         tableKey:
                  //           values.year +
                  //           '' +
                  //           (values.yearFund + '') +
                  //           Math.trunc(Math.random() * 100),
                  //       });
                  //       setYearFoundData(temp);
                  //       return true;
                  //     }}
                  //     width={'20%'}
                  //     grid
                  //     modalProps={{
                  //       destroyOnClose: true,
                  //     }}
                  //   >
                  //     <ProFormDatePicker.Year
                  //       name={'year'}
                  //       label={'年度'}
                  //       rules={[{ required: true, message: '请输入' }]}
                  //     />
                  //     <ProFormDigit
                  //       name={'yearFund'}
                  //       label={'到校款金额(万元)'}
                  //       rules={[{ required: true, message: '请输入' }]}
                  //     />
                  //   </ModalForm>
                  // }
                >
                  <ProTable
                    columns={columnsYearFoundForm}
                    dataSource={yearFundData}
                    search={false}
                    size={'small'}
                    rowKey={'tableKey'}
                    toolBarRender={false}
                    pagination={false}
                  ></ProTable>
                </ProCard>
              </ProForm.Group>
              <ProForm.Group rowProps={{ gutter: gutter }} title={'佐证材料'}>
                <ProFormSelect
                  name={'labelList'}
                  label={'项目标签'}
                  mode={'multiple'}
                  colProps={{ span: 5 }}
                  fieldProps={{ labelInValue: false }}
                  options={getAllLabel.data}
                  hidden={localStorage.getItem('identity') !== '管理员'}
                  addonAfter={
                    <ModalForm<{
                      year: string;
                      labelName: string;
                    }>
                      title="新增标签"
                      trigger={<a>新增标签</a>}
                      autoFocusFirstInput
                      modalProps={{
                        onCancel: () => console.log('run'),
                      }}
                      submitTimeout={2000}
                      onFinish={async (values) => {
                        addLabelDetail.run(values);
                        return true;
                      }}
                    >
                      <ProForm.Group>
                        <ProFormDatePicker.Year
                          width="md"
                          name="year"
                          label="标签年份"
                          required
                        />
                        <ProFormText
                          width="md"
                          name="labelName"
                          label="标签名称"
                          required
                        />
                      </ProForm.Group>
                    </ModalForm>
                  }
                />
                <ProForm.Group>
                  <ModalForm
                    title="上传材料"
                    trigger={
                      <Button icon={<UploadOutlined />} type="link">
                        上传材料（上传已盖章的项目相关佐证材料，以项目名称命名）
                      </Button>
                    }
                    autoFocusFirstInput
                    submitTimeout={2000}
                    onFinish={async (values) => true}
                  >
                    {/* TbaleExplainMap['STANDARD'] 要修改 */}
                    <ProCard
                      title={'上传已盖章的项目相关佐证材料，以项目名称命名'}
                    >
                      {/* 有小问题，需要修改成pro的dragger */}
                      <Dragger {...props} maxCount={1}>
                        <p className="ant-upload-drag-icon">
                          <InboxOutlined />
                        </p>
                        <p className="ant-upload-text">
                          单击或拖动文件到此区域进行上传
                        </p>
                        <p className="ant-upload-hint">请上传一个文件</p>
                      </Dragger>
                    </ProCard>
                  </ModalForm>
                  <Button
                    type="link"
                    onClick={() => {
                      formRef.current?.getFieldValue('annexPath')
                        ? window.open(
                            formRef.current?.getFieldValue('annexPath'),
                          )
                        : message.info('请上传材料');
                    }}
                    icon={<FileSearchOutlined />}
                  >
                    查看材料
                  </Button>
                </ProForm.Group>
              </ProForm.Group>
            </ProForm>
          )}
        </>
      }
    >
      <Modal
        visible={userListTabelFlag}
        onOk={() => {
          console.log(selectedUserListTabelData);
          switch (saveType) {
            case '新增':
              insertSubmit();
              break;
            case '更新':
              updateSubmit();
              break;
            case '暂存':
              tempSubmit();
              break;
          }
          setUserListTabelFlag(false);
        }}
        onCancel={() => setUserListTabelFlag(false)}
        title={'请选择负责人'}
      >
        {/* <Divider/> */}
        <ProTable
          // name={'table'}
          rowKey={'webId'}
          columns={columns}
          search={false}
          dataSource={userListTabelData}
          toolBarRender={false}
          rowSelection={{
            onChange: (selectedRowKeys, selectedRows) => {
              setSelectedUserListTabelData(selectedRows);
              setSelectedRowKeys(selectedRowKeys);
            },
            selectedRowKeys: selectedRowKeys,
          }}
          tableAlertRender={false}
          pagination={false}
        />
      </Modal>

      <Modal
        visible={yearVisible}
        footer={
          <Space>
            <Button
              type={'primary'}
              onClick={() => {
                setYearVisible(false);
              }}
            >
              取消
            </Button>
            <Button
              type={'primary'}
              onClick={() => {
                updateYearFund.run({
                  tableName: 'INTER_CPT_PROJECT',
                  itemId: parseInt(pageType),
                  pyList: yearFundData,
                });
              }}
            >
              提交
            </Button>
          </Space>
        }
        onCancel={() => setYearVisible(false)}
        title={
          <Space>
            <>{'年度到校金额'}</>
            {/* <>{'  '}</>
            <ModalForm
              title={'新增到校款'}
              trigger={<Button type={'primary'}> 新增到校款</Button>}
              onFinish={async (values) => {
                var temp = JSON.parse(JSON.stringify(yearFundData));
                temp.push({
                  ...values,
                  tableKey:
                    values.year +
                    '' +
                    (values.yearFund + '') +
                    Math.trunc(Math.random() * 100),
                });
                setYearFoundData(temp);
                return true;
              }}
              width={'20%'}
              grid
              modalProps={{
                destroyOnClose: true,
              }}
            >
              <ProFormDatePicker.Year
                name={'year'}
                label={'年度'}
                rules={[{ required: true, message: '请输入' }]}
              />
              <ProFormDigit
                name={'yearFund'}
                label={'到校款金额(万元)'}
                rules={[{ required: true, message: '请输入' }]}
              />
            </ModalForm> */}
          </Space>
        }
        width={'30%'}
      >
        <ProTable
          columns={columnsYearFoundList}
          dataSource={yearFundData}
          search={false}
          size={'small'}
          rowKey={'tableKey'}
          toolBarRender={false}
          pagination={false}
        />
      </Modal>
    </PageContainer>
  );
};
